<%@ page language="java" contentType="text/html; charset=utf-8"  pageEncoding="utf-8"%>
<!DOCTYPE html>
<html ng-app="autocompleteDemo">
<head>
<meta charset="utf-8">
<title>管理页面</title>

    <!-- <link rel="stylesheet" href="./admin/node_modules/angular-material/layouts/angular-material.layouts.min.css"> -->
    <!-- AngularJS Material CSS using GitCDN to load directly from `bower-material/master` -->
    <link rel="stylesheet" href="https://gitcdn.xyz/cdn/angular/bower-material/master/angular-material.css">
      <style>
         .box {         
            color:white;
            padding:10px;
            text-align:center;
            border-style: inset;
         }
         .green {
            background:green;
         }
         .blue {
            background:blue;
         }
      </style>
      
</head>
<body>

    <!-- AngularJS Material Dependencies -->
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.7.9/angular.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.7.9/angular-animate.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.7.9/angular-aria.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.7.9/angular-messages.min.js"></script>

    <!-- AngularJS Material Javascript using GitCDN to load directly from `bower-material/master` -->
    <script src="https://gitcdn.xyz/cdn/angular/bower-material/master/angular-material.js"></script>
    
    <script src="./admin/index.js" type="text/javascript"></script>
	需要登录成功才会显示
	

	
	<div ng-controller="DemoCtrl as ctrl" layout="column" ng-cloak>
	
	<div layout = "row" layout-xs = "column">
            <div flex class = "green box">Row 1: Item 1</div>
            <div flex = "20" class = "blue box">Row 1: Item 2</div>
         </div>
         <div layout = "column" layout-xs = "column">
            <div flex = "33" class = "green box">Column 1: item 1</div>
            <div flex = "66" class = "blue box">Column 1: item 2</div>
         </div>
         
         
	<div layout="row">
  <div flex="10" class = "green box">First item in row</div>
  <div flex="90" class = "green box">Second item in row</div>
</div>
<div layout="column">
  <div flex="33" class = "green box">First item in column</div>
  <div flex="66" class = "green box">Second item in column</div>
</div>
	
	  <md-content class="md-padding">
	    <form ng-submit="$event.preventDefault()">
	      <p id="autocompleteDescription">
	        Use <code>md-autocomplete</code> to search for matches from local or remote data sources.
	      </p>
	      <label id="favoriteStateLabel">Favorite State</label>
	      <md-autocomplete
	          ng-disabled="ctrl.isDisabled"
	          md-no-cache="ctrl.noCache"
	          md-selected-item="ctrl.selectedItem"
	          md-search-text-change="ctrl.searchTextChange(ctrl.searchText)"
	          md-search-text="ctrl.searchText"
	          md-selected-item-change="ctrl.selectedItemChange(item)"
	          md-items="item in ctrl.querySearch(ctrl.searchText)"
	          md-item-text="item.display"
	          md-min-length="0"
	          md-escape-options="clear"
	          placeholder="Ex. Alaska"
	          input-aria-labelledby="favoriteStateLabel">
	        <md-item-template>
	          <span md-highlight-text="ctrl.searchText" md-highlight-flags="^i">{{item.display}}</span>
	        </md-item-template>
	        <md-not-found>
	          No states matching "{{ctrl.searchText}}" were found.
	          <a ng-click="ctrl.newState(ctrl.searchText)">Create a new one!</a>
	        </md-not-found>
	      </md-autocomplete>
	      <br/>
	      <md-checkbox ng-model="ctrl.simulateQuery">Simulate query for results?</md-checkbox>
	      <md-checkbox ng-model="ctrl.noCache">Disable caching of queries?</md-checkbox>
	      <md-checkbox ng-model="ctrl.isDisabled">Disable the input?</md-checkbox>
	      <p id="autocompleteDetailedDescription">
	        By default, <code>md-autocomplete</code> will cache results when performing a query.
	        After the initial call is performed, it will use the cached results to eliminate unnecessary
	        server requests or lookup logic. This can be disabled above.
	      </p>
	    </form>
	  </md-content>
	</div>
	
	

</body>
</html>